var ConfirmGoodsHeader = React.createClass({
    render: function(){
        return(
            <header data-am-widget="header" className="am-header am-header-default am-header-fixed">
                <div className="am-header-left am-header-nav"><a onClick={handleBackClick}><i className="icon_8"></i></a></div>
                <h1 className="am-header-title">商品清单</h1>
            </header>
        )
    }
});
var GoodsItem = React.createClass({
    render: function () {
        var totalCount = 0, specsArr = [];
        this.props.specs.forEach(function(value){
            specsArr.push(
                <div>{value.colorDesc}，{value.lengthDesc}码，{value.number}双；</div>
            );
            totalCount += parseInt(value.number);
        });
        return (
            <div className="item am-margin-bottom-sm am-padding-left-sm am-padding-right-sm bg-white">
                <div className="goodlist">
                    <div className="gooditem border-bottom box am-padding-top-sm am-padding-bottom-sm prelative">
                        <div><img src={IMG_PRE+this.props.img} className="width-100px"/></div>
                        <div className="box-1 am-margin-left-sm am-margin-top-xs">
                            <div className="box">
                                <div className="box-1 am-text-truncate">{this.props.name}</div>
                                <div className="font-color-1 font-14">x{totalCount}</div>
                            </div>
                            <div className="box font-14 font-color-1">
                                <div>已选:</div>
                                <div className="box-1 specs">{specsArr}</div>
                            </div>
                            <div className="font-color-main">&yen;{parseFloat(this.props.price).toFixed(2)}</div>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
});

var orderData = localStorage.getItem('order');
if(orderData){
    orderData = JSON.parse(orderData);
}

var Page = React.createClass({
    render: function() {
        var itemsArr = [];
        orderData.offers.forEach(function(value){
            itemsArr.push(
                <GoodsItem specs={value.specs} price={value.price} img={value.img} name={value.name}/>
            );
        }.bind(this));
        return (
            <div>
                <ConfirmGoodsHeader />
                <section id="amz-main" data-tag="css-nav">
                    <div className="padding-bottom-55">{itemsArr}</div>
                    {/*<CartPrice submitItems={this.props.submitItems} setTotal={this.props.setTotal} total={this.props.total} />*/}
                </section>
            </div>
        )
    }
});

ReactDOM.render(
    <Page />,
    document.getElementById('root')
);